<!DOCTYPE html>
<html>
<head>
    <title>V-Once</title>
     <script src="../js/vue.min.js"></script>  <!-- 用于在页面中引入vue.js,会阻塞页面的渲染, 还可以放在body的最下方, 不会阻塞页面的渲染. 但是js脚本还是会被阻塞 -->
</head>
<body>
    <!-- Your HTML code goes here -->
    <div id="root">
        <h2 v-once>初始值n: {{n}}</h2> <!-- 第一次渲染后就视为静态内容了 -->
        <h2>当前n: {{n}}</h2>
        <button @click="n++">+1</button>
    </div>
</body>
<script>
    new Vue({
        el: "#root",
        data: {
            n:0
        }
    })
</script>
</html>
